接下来我们视线会移动到右上方的高闲置区，所以这个部分我们可以加入一些推广，图片，辅助资料列表等（移动端的界面大小相对Web没有那么大的浏览范围，所以高闲置区以Web端为例。）如UI中国的详情页，会把标签、最新话等权重比不高的放大右侧。如下图

然后我们会进入左下角的低闲置区，这个部分可以理解为“休息区”，例如我们在资讯APP中，左下角通常是评论的输入区，或者在网页中，左侧也是留资的区域。最后，在右下角的终端区将引导用户得出合乎逻辑的结论。在界面上使用古登堡图表可让用户把握阅读节奏和增强对阅读的理解。这种模式也可以让我们洞察到在那些最有可能被阅读或注意的地方放置重要元素。 

F模式

F模式顾名思义，就是元素在页面上类似F的定位。人们通常扫视页面的时候都是由上到下，又左到右。有意思的是，据尼尔森·诺曼的研究显示，眼睛越往下阅读，扫读的距离也会越来越短。如下图

 

通过运用F模式可以确保页面上有一个高效的视觉层次解决，这样用户就可以快速浏览内容例如：我们在做图文列表界面时，如果界面中想以图片吸引用户点击的话，那么就可以把图片放到界面的左侧，如得到APP。如果想以标题吸引用户点击的话，就可以把标题放入界面的左侧。  

 

Z模式

Z模式排版与会让读者的视线经过“闲置区”，可以看到所以的元素。简约的界面可以使用Z模型，它以一致的布局和视觉上令人满意的内容结构为用户带来愉悦。 

 

在使用Z模式设计时，应遵循以下结构：1.顶部的水平线应该包括醒目的内容和元素，比例logo和导航2.对角线该向用户介绍主要内容3.一条较低的水平线，他可以刺激用户执行某些动作，比如留资、注册、电话、订阅等。

对比虾米音乐来看，网易云音乐更注重沉浸式的体验，听音乐就好好听，看评论的时候就好好看。这二者没有好与不好，而是需要结合他们的产品目标来看。  

总结

视觉排版的知识让设计师理解用户是如何感知和识别页面内容的。成功地应用这些模式可以使我们构建和优化出让用户愉悦的界面，并创造整体产品的易用性。

 

关键词：优秀h5 注册h5页面 h5优惠